<template>
  <div>
    <div class="px-radius">
      <el-row>
        <!-- 数据 -->
        <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
          <el-tab-pane label="全部" name="first">
            <!-- 搜索 -->
            <el-col :span="5" :offset="14" style="margin-bottom:15px">
              <el-input placeholder="请输入编号" v-model="input3" class="input-with-select">
                <el-select v-model="select" slot="prepend" placeholder="请选择">
                  <el-option label="事项编号" value="1"></el-option>
                  <el-option label="申请人" value="2"></el-option>
                  <el-option label="申请时间" value="3"></el-option>
                </el-select>
                <el-button slot="append" icon="el-icon-search" @click="approveSearch"></el-button>
              </el-input>
            </el-col>
            <!-- 表格内容 -->
            <el-table
              border
              :data="tableData1e.slice((currentPage-1)*pagesize,currentPage*pagesize)"
              style="width: 80%"
              :row-class-name="tableRowClassName"
            >
              <el-table-column type="index" :index="indexMethod" width="50" label="序号"></el-table-column>
              <el-table-column prop="reimid" label="事项编号"></el-table-column>
              <!-- <el-table-column prop="currentnode" label="节点号"></el-table-column> -->

              <el-table-column prop="addtime" label="申请日期"></el-table-column>
              <!-- <el-table-column prop="department" label="申请部门"></el-table-column> -->
              <el-table-column prop="username" label="申请人"></el-table-column>
              <el-table-column prop="flowno" label="申请事项"></el-table-column>
              <el-table-column prop="reimtypeid" label="报销类型"></el-table-column>

              <el-table-column prop="feedetails" label="报销原因"></el-table-column>
              <el-table-column prop="reimamount" label="报销金额"></el-table-column>
              <!-- <el-table-column prop="status" label="审批状态"></el-table-column>
              <el-table-column prop="result" label="审批结果"></el-table-column>-->
              <el-table-column prop="operating" label="操作">
                <template slot-scope="scope">
                  <el-button @click="pass(scope.row)" type="text" size="small">审批</el-button>
                  <!-- <el-button @click="reject(scope.row)" type="text" size="small">驳回</el-button> -->
                  <!-- 审批模态框 -->
                  <el-dialog
                    title="审批"
                    :visible.sync="dialogVisible"
                    width="30%"
                    :before-close="handleClose"
                    :modal-append-to-body="false"

                  >
                    <el-form
                      :label-position="labelPosition"
                      label-width="80px"
                      :model="formLabelAlign"
                    >
                      <el-form-item label="事项编号">
                        <el-input v-model="formLabelAlign.reimid" readonly></el-input>
                      </el-form-item>
                      <!-- <el-form-item label="节点号">
                        <el-input v-model="formLabelAlign.currentnode" readonly></el-input>
                      </el-form-item>-->
                      <el-form-item label="申请时间">
                        <el-input v-model="formLabelAlign.addtime" readonly></el-input>
                      </el-form-item>
                      <!-- <el-form-item label="申请人">
                        <el-input v-model="formLabelAlign.username" readonly></el-input>
                      </el-form-item>-->
                      <el-form-item label="申请事项">
                        <el-input v-model="formLabelAlign.flowno" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="报销类型">
                        <el-input v-model="formLabelAlign.reimtypeid" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="报销原因">
                        <el-input v-model="formLabelAlign.feedetails" readonly></el-input>
                      </el-form-item>
                       <el-form-item label="报销金额">
                        <el-input v-model="formLabelAlign.reimamount" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="审批人">
                        <el-input v-model="formLabelAlign.userName1"></el-input>
                      </el-form-item>
                      <el-form-item label="审批意见">
                        <el-input v-model="formLabelAlign.remark"></el-input>
                      </el-form-item>
                    </el-form>
                    <span slot="footer" class="dialog-footer">
                      <el-button @click="overApprove ">驳回</el-button>
                      <el-button type="primary" @click="passApprove">通过</el-button>
                    </span>
                  </el-dialog>
                </template>
              </el-table-column>
            </el-table>
            <!-- 分页 -->
            <div v-if="tableData1e.length>pagesize">
              <div class="block my-fy">
                <el-pagination
                  @size-change="pxSizeChange"
                  @current-change="pxCurrentChange"
                  :current-page="currentPage"
                  :page-sizes="[5, 10, 15, 20]"
                  :page-size="pagesize"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="tableData1e.length"
                  :hide-on-single-page="true"
                ></el-pagination>
              </div>
            </div>
          </el-tab-pane>

          <el-tab-pane @click="waitapprove" label="待处理" name="second">
            <el-table
              border
              :data="tableData2e.slice((currentPage-1)*pagesize,currentPage*pagesize)"
              style="width: 90%"
              :row-class-name="tableRowClassName"
            >
              <el-table-column type="index" :index="indexMethod" width="50" label="序号"></el-table-column>
              <el-table-column prop="reimid" label="编号"></el-table-column>
              <!-- <el-table-column prop="currentnode" label="节点号"></el-table-column> -->

              <el-table-column prop="addtime" label="申请日期"></el-table-column>
              <!-- <el-table-column prop="department" label="申请部门"></el-table-column> -->
              <el-table-column prop="username" label="申请人"></el-table-column>
              <el-table-column prop="flowno" label="申请事项"></el-table-column>
              <el-table-column prop="reimtypeid" label="报销类型"></el-table-column>

              <el-table-column prop="feedetails" label="报销原因"></el-table-column>
              <el-table-column prop="reimamount" label="报销金额"></el-table-column>

              <el-table-column prop="status" label="审批状态"></el-table-column>
              <!-- <el-table-column prop="result" label="审批结果"></el-table-column> -->
              <el-table-column prop="operating" label="操作">
                <template slot-scope="scope">
                  <el-button @click="pass(scope.row)" type="text" size="small">审批</el-button>
                  <!-- <el-button @click="reject(scope.row)" type="text" size="small">驳回</el-button> -->
                  <!-- 审批模态框 -->
                  <el-dialog
                    title="审批"
                    :visible.sync="dialogVisible"
                    width="30%"
                    :before-close="handleClose"
                    :modal-append-to-body="false"

                    >
                    <el-form
                      :label-position="labelPosition"
                      label-width="80px"
                      model="formLabelAlign"
                    >
                      <el-form-item label="事项编号">
                        <el-input v-model="formLabelAlign.reimid" readonly></el-input>
                      </el-form-item>

                      <el-form-item label="申请时间">
                        <el-input v-model="formLabelAlign.addtime" readonly></el-input>
                      </el-form-item>
                      <!-- <el-form-item label="申请人">
                        <el-input v-model="formLabelAlign.username" readonly></el-input>
                      </el-form-item>-->
                      <el-form-item label="申请事项">
                        <el-input v-model="formLabelAlign.flowno" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="报销类型">
                        <el-input v-model="formLabelAlign.reimtypeid" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="报销原因">
                        <el-input v-model="formLabelAlign.feedetails" readonly></el-input>
                      </el-form-item>
                       <el-form-item label="报销金额">
                        <el-input v-model="formLabelAlign.reimamount" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="审批人">
                        <el-input v-model="formLabelAlign.userName1"></el-input>
                      </el-form-item>
                      <el-form-item label="审批意见">
                        <el-input v-model="formLabelAlign.remark"></el-input>
                      </el-form-item>
                    </el-form>
                    <span slot="footer" class="dialog-footer">
                      <el-button @click="overApprove ">驳回</el-button>
                      <el-button type="primary" @click="passApprove">通过</el-button>
                    </span>
                  </el-dialog>
                </template>
              </el-table-column>
            </el-table>
            <!-- 分页 -->
            <div v-if="tableData2e.length>pagesize">
              <div class="block my-fy">
                <el-pagination
                  @size-change="pxSizeChange"
                  @current-change="pxCurrentChange"
                  :current-page="currentPage"
                  :page-sizes="[5, 10, 15, 20]"
                  :page-size="pagesize"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="tableData2e.length"
                  :hide-on-single-page="true"
                ></el-pagination>
              </div>
            </div>
          </el-tab-pane>
          <el-tab-pane label="已处理" name="third">
            <el-table
              border
              :data="tableData3.slice((currentPage-1)*pagesize,currentPage*pagesize)"
              style="width: 90%"
              :row-class-name="tableRowClassName"
            >
              <el-table-column type="index" width="50" label="序号"></el-table-column>
              <el-table-column prop="date" label="申请日期" width="180"></el-table-column>
              <el-table-column prop="department" label="申请部门"></el-table-column>
              <el-table-column prop="name" label="申请人"></el-table-column>
              <el-table-column prop="matter" label="申请事项"></el-table-column>
              <el-table-column prop="matterDescription" label="事项说明"></el-table-column>
              <el-table-column prop="status" label="审批状态"></el-table-column>
              <el-table-column prop="result" label="审批结果"></el-table-column>
              <el-table-column prop="operating" label="操作">
                <template slot-scope="scope">
                  <el-button @click="pass3(scope.row)" type="text" size="small">查看</el-button>
                  <!-- <el-button @click="reject(scope.row)" type="text" size="small">驳回</el-button> -->
                  <!-- 审批模态框
                  <el-dialog
                    title="提示"
                    :visible.sync="dialogVisible"
                    width="30%"
                    :before-close="handleClose"
                  >
                    <el-form
                      :label-position="labelPosition"
                      label-width="80px"
                      :model="formLabelAlign"
                    >
                      <el-form-item label="事项编号">
                        <el-input v-model="formLabelAlign.approveId" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="申请人">
                        <el-input v-model="formLabelAlign.name" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="申请事项">
                        <el-input v-model="formLabelAlign.matter" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="审批人">
                        <el-input v-model="formLabelAlign.aName" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="审批意见">
                        <el-input v-model="formLabelAlign.suggest"></el-input>
                      </el-form-item>
                    </el-form>
                    <span slot="footer" class="dialog-footer">
                      <el-button @click="overApprove ">驳回</el-button>
                      <el-button type="primary" @click="passApprove">通过</el-button>
                    </span>
                  </el-dialog>-->
                </template>
              </el-table-column>
            </el-table>
            <div v-if="tableData3.length>pagesize">
              <div class="block my-fy">
                <el-pagination
                  @size-change="pxSizeChange"
                  @current-change="pxCurrentChange"
                  :current-page="currentPage"
                  :page-sizes="[5, 10, 15, 20]"
                  :page-size="pagesize"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="tableData3.length"
                  :hide-on-single-page="true"
                ></el-pagination>
              </div>
            </div>
          </el-tab-pane>
          <el-tab-pane label="已发起" name="fourth">
            <el-table
              border
              :data="tableData4.slice((currentPage-1)*pagesize,currentPage*pagesize)"
              style="width: 90%"
              :row-class-name="tableRowClassName"
            >
              <el-table-column type="index" width="50" label="序号"></el-table-column>
              <el-table-column prop="date" label="申请日期" width="180"></el-table-column>
              <el-table-column prop="department" label="申请部门"></el-table-column>
              <el-table-column prop="name" label="申请人"></el-table-column>
              <el-table-column prop="matter" label="申请事项"></el-table-column>
              <el-table-column prop="matterDescription" label="事项说明"></el-table-column>
              <el-table-column prop="status" label="审批状态"></el-table-column>
              <el-table-column prop="result" label="审批结果"></el-table-column>
              <el-table-column prop="operating" label="操作">
                <template slot-scope="scope">
                  <el-button @click="pass3(scope.row)" type="text" size="small">查看</el-button>
                  <!-- <el-button @click="reject(scope.row)" type="text" size="small">驳回</el-button> -->
                  <!-- 审批模态框
                  <el-dialog
                    title="提示"
                    :visible.sync="dialogVisible"
                    width="30%"
                    :before-close="handleClose"
                  >
                    <el-form
                      :label-position="labelPosition"
                      label-width="80px"
                      :model="formLabelAlign"
                    >
                      <el-form-item label="事项编号">
                        <el-input v-model="formLabelAlign.approveId" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="申请人">
                        <el-input v-model="formLabelAlign.name" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="申请事项">
                        <el-input v-model="formLabelAlign.matter" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="审批人">
                        <el-input v-model="formLabelAlign.aName" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="审批意见">
                        <el-input v-model="formLabelAlign.suggest"></el-input>
                      </el-form-item>
                    </el-form>
                    <span slot="footer" class="dialog-footer">
                      <el-button @click="overApprove ">驳回</el-button>
                      <el-button type="primary" @click="passApprove">通过</el-button>
                    </span>
                  </el-dialog>-->
                </template>
              </el-table-column>
            </el-table>
            <div v-if="tableData4.length>pagesize">
              <div class="block my-fy">
                <el-pagination
                  @size-change="pxSizeChange"
                  @current-change="pxCurrentChange"
                  :current-page="currentPage"
                  :page-sizes="[5, 10, 15, 20]"
                  :page-size="pagesize"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="tableData4.length"
                  :hide-on-single-page="true"
                ></el-pagination>
              </div>
            </div>
          </el-tab-pane>
          <el-tab-pane label="我接收的" name="five">
            <el-table
              border
              :data="tableData5.slice((currentPage-1)*pagesize,currentPage*pagesize)"
              style="width: 90%"
              :row-class-name="tableRowClassName"
            >
              <el-table-column type="index" :index="indexMethod" width="50" label="序号"></el-table-column>
              <el-table-column prop="approveId" label="编号"></el-table-column>

              <el-table-column prop="date" label="申请日期" width="180"></el-table-column>
              <el-table-column prop="department" label="申请部门"></el-table-column>
              <el-table-column prop="name" label="申请人"></el-table-column>
              <el-table-column prop="matter" label="申请事项"></el-table-column>
              <el-table-column prop="matterDescription" label="事项说明"></el-table-column>
              <el-table-column prop="status" label="审批状态"></el-table-column>
              <el-table-column prop="result" label="审批结果"></el-table-column>
              <el-table-column prop="operating" label="操作">
                <template slot-scope="scope">
                  <el-button @click="pass3(scope.row)" type="text" size="small">审批</el-button>
                  <el-button @click="reject(scope.row)" type="text" size="small">驳回</el-button>
                  <!-- 审批模态框 -->
                  <!-- <el-dialog
                    title="提示"
                    :visible.sync="dialogVisible"
                    width="30%"
                    :before-close="handleClose"
                  >
                    <el-form
                      :label-position="labelPosition"
                      label-width="80px"
                      :model="formLabelAlign"
                    >
                      <el-form-item label="事项编号">
                        <el-input v-model="formLabelAlign.approveId" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="申请人">
                        <el-input v-model="formLabelAlign.name" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="申请事项">
                        <el-input v-model="formLabelAlign.matter" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="审批人">
                        <el-input v-model="formLabelAlign.aName" readonly></el-input>
                      </el-form-item>
                      <el-form-item label="审批意见">
                        <el-input v-model="formLabelAlign.suggest"></el-input>
                      </el-form-item>
                    </el-form>
                    <span slot="footer" class="dialog-footer">
                      <el-button @click="overApprove ">驳回</el-button>
                      <el-button type="primary" @click="passApprove">通过</el-button>
                    </span>
                  </el-dialog>-->
                </template>
              </el-table-column>
            </el-table>

            <!-- 分页 -->
            <div v-if="tableData5.length>pagesize">
              <div class="block my-fy">
                <el-pagination
                  @size-change="pxSizeChange"
                  @current-change="pxCurrentChange"
                  :current-page="currentPage"
                  :page-sizes="[5, 10, 15, 20]"
                  :page-size="pagesize"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="tableData5.length"
                  :hide-on-single-page="true"
                ></el-pagination>
              </div>
            </div>
          </el-tab-pane>
        </el-tabs>
      </el-row>
    </div>
  </div>
</template>

<script>
export default {
  name: "bxapprove",
  data() {
    return {
      approvearr: [], //接收后台返回需要审批的数据
      labelPosition: "right",
      dialogVisible: false, //模态框默认关闭
      input3: "",
      select: 1,
      currentPage: 1, //默认页码为1
      pagesize: 5, //默认一页显示5条
      url:
        "https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg",
      publicPath: process.env.BASE_URL,
      srcList: [
        "https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg",
        "https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg",
        "https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg",
      ],
      activeName: "first",
      //   表格
      tableData1e: [
        {
          currentnode: "", //节点号
          reimid: 20200001, //事项编号
          index: "1",
          addtime: "2020-09-02",
          username: "", //申请人
          flowno: "报销", //申请事项
           reimtypeid:'',//报销类型
          feedetails:'',//报销原因
          reimamount:'',//报销金额
          otreason: "家里有事处理 ", //事项说明
          // status: "已处理", //审批状态
          // result: "已通过", //审批结果
        },
        // {
        //   approveId: 20200002,

        //   addtime: "2020-08-08",
        //   department: "人事部", //申请部门
        //   username: "李明", //申请人
        //   matter: "招聘教师", //申请事项
        //   matterDescription: "需招聘两名外语讲师 ", //事项说明
        //   status: "待处理", //审批状态
        //   result: "", //审批结果
        // },
        // {
        //   approveId: 20200003,

        //   addtime: "2020-08-05",
        //   department: "教学部", //申请部门
        //   username: "张淑娟", //申请人
        //   matter: "报销", //申请事项
        //   matterDescription: "活动经费报销 ", //事项说明
        //   status: "已处理", //审批状态
        //   result: "已通过", //审批结果
        // },
        // {
        //   approveId: 20200004,

        //   addtime: "2020-07-02",
        //   department: "学生会", //申请部门
        //   username: "王晓明", //申请人
        //   matter: "费用申请", //申请事项
        //   matterDescription: "活动经费申请 ", //事项说明
        //   status: "已处理", //审批状态
        //   result: "已驳回", //审批结果
        // },
        // {
        //   approveId: 20200005,

        //   addtime: "2020-06-02",
        //   department: "研发部", //申请部门
        //   username: "黄天鸿", //申请人
        //   matter: "采购设备", //申请事项
        //   matterDescription: "实验室添加新的教学设备 ", //事项说明
        //   status: "待处理", //审批状态
        //   result: "", //审批结果
        // },
        // {
        //   approveId: 20200006,

        //   addtime: "2020-06-02",
        //   department: "研发部", //申请部门
        //   username: "小小", //申请人
        //   matter: "采购设备", //申请事项
        //   matterDescription: "实验室添加新的教学设备 ", //事项说明
        //   status: "待处理", //审批状态
        //   result: "", //审批结果
        // },
      ],
      tableData2e: [
        {
          currentnode: "", //节点号
          reimid: 20200001, //事项编号
          index: "1",
          addtime: "2020-09-02",
          username: "", //申请人
          flowno: "报销", //申请事项
           reimtypeid:'',//报销类型
          feedetails:'',//报销原因
          reimamount:'',//报销金额
          otreason: "家里有事处理 ", //事项说明
          status: "待处理", //审批状态
        },
        // {
        //   currentnode: "", //节点号
        //   leaveid: 20200001, //事项编号
        //   index: "1",
        //   addtime: "2020-09-02",
        //   department: "人事部", //申请部门
        //   username: "李明", //申请人
        //   systemid: "招聘教师", //申请事项
        //   reasonleave: "需招聘两名外语讲师 ", //事项说明
        //   status: "待处理", //审批状态
        //   result: "", //审批结果
        // },
      ],
      tableData3: [
        {
          date: "2020-09-02",
          department: "教学部", //申请部门
          name: "王小虎", //申请人
          matter: "请假", //申请事项
          matterDescription: "家里有事处理 ", //事项说明
          status: "已处理", //审批状态
          result: "已通过", //审批结果
        },
        {
          date: "2020-08-05",
          department: "教学部", //申请部门
          name: "张淑娟", //申请人
          matter: "报销", //申请事项
          matterDescription: "活动经费报销 ", //事项说明
          status: "已处理", //审批状态
          result: "已通过", //审批结果
        },
        {
          date: "2020-07-02",
          department: "学生会", //申请部门
          name: "王晓明", //申请人
          matter: "费用申请", //申请事项
          matterDescription: "活动经费申请 ", //事项说明
          status: "已处理", //审批状态
          result: "已驳回", //审批结果
        },
      ],
      tableData4: [
        {
          date: "2020-09-02",
          department: "教学部", //申请部门
          name: "王小虎", //申请人
          matter: "请假", //申请事项
          matterDescription: "家里有事处理 ", //事项说明
          status: "已处理", //审批状态
          result: "已通过", //审批结果
        },
        {
          date: "2020-08-08",
          department: "人事部", //申请部门
          name: "李明", //申请人
          matter: "招聘教师", //申请事项
          matterDescription: "需招聘两名外语讲师 ", //事项说明
          status: "待处理", //审批状态
          result: "", //审批结果
        },
      ],
      tableData5: [
        {
          approveId: 20200001,
          date: "2020-09-02",
          department: "教学部", //申请部门
          name: "王小虎", //申请人
          matter: "请假", //申请事项
          matterDescription: "家里有事处理 ", //事项说明
          status: "已处理", //审批状态
          result: "已通过", //审批结果
        },
        {
          approveId: 20200002,
          date: "2020-08-08",
          department: "人事部", //申请部门
          name: "李明", //申请人
          matter: "招聘教师", //申请事项
          matterDescription: "需招聘两名外语讲师 ", //事项说明
          status: "待处理", //审批状态
          result: "", //审批结果
        },
        {
          approveId: 20200003,
          date: "2020-08-08",
          department: "人事部", //申请部门
          name: "李明", //申请人
          matter: "招聘教师", //申请事项
          matterDescription: "需招聘两名外语讲师 ", //事项说明
          status: "待处理", //审批状态
          result: "", //审批结果
        },
        {
          approveId: 20200004,
          date: "2020-09-02",
          department: "教学部", //申请部门
          name: "王小虎", //申请人
          matter: "请假", //申请事项
          matterDescription: "家里有事处理 ", //事项说明
          status: "已处理", //审批状态
          result: "已通过", //审批结果
        },
        {
          approveId: 20200005,
          date: "2020-08-08",
          department: "人事部", //申请部门
          name: "李明", //申请人
          matter: "招聘教师", //申请事项
          matterDescription: "需招聘两名外语讲师 ", //事项说明
          status: "待处理", //审批状态
          result: "", //审批结果
        },
        {
          approveId: 20200006,
          date: "2020-08-08",
          department: "人事部", //申请部门
          name: "李明", //申请人
          matter: "招聘教师", //申请事项
          matterDescription: "需招聘两名外语讲师 ", //事项说明
          status: "待处理", //审批状态
          result: "", //审批结果
        },
      ],
      // 模态框
      formLabelAlign: {
        currentnode: "", //节点号
        reimid: "", //事项编号
        addtime: "", //申请时间
        username: "", //申请人
        flowno: "", //申请事项
        feedetails:'',//报销原因
        reimamount:'',//报销金额
        userName1: "", //审批人
        remark: "", //审批建议
        reimtypeid:'',//报销类型
      },
    };
  },
  methods: {
    // 页面初始化请求后台数据
    // 领导审批加班单接口
    initInfo() {
       let pid=JSON.parse(sessionStorage.getItem('empid'));

      let url = "/api/selectOwnReim";
      let data = {
        empid: pid,
      };
      this.$axios({
        method: "post",
        url: url,
        // headers: {
        //   "Content-Type": "application/json;charset=utf-8",
        // },
        data: JSON.stringify(data),
      })
        .then((resp) => {
          // console.log(resp);
          let that = this;
          if (resp.status === 200) {
            // console.log(resp.data.data);
            let arr = resp.data.data;
            // console.log(arr);

            let temparr = [];
            for (let i = 0; i < arr.length; i++) {
              if (arr[i].reimtypeid == 0) {
                arr[i].flowno = "报销";
                arr[i].reimtypeid = "业务招待费";
                arr[i].userName1 = '赵六'

                temparr.push(arr[i]);
              }else if(arr[i].reimtypeid == 1){
                  arr[i].flowno = "报销";
                arr[i].reimtypeid = "差旅费";
                 arr[i].userName1 = '赵六'
                temparr.push(arr[i]);
              }else if(arr[i].reimtypeid == 2){
                  arr[i].flowno = "报销";
                arr[i].reimtypeid = "会议费";
                 arr[i].userName1 = '赵六'
                temparr.push(arr[i]);
              }else if(arr[i].reimtypeid == 3){
                  arr[i].flowno = "报销";
                arr[i].reimtypeid = "办公水电费";
                 arr[i].userName1 = '赵六'
                temparr.push(arr[i]);
              }else if(arr[i].reimtypeid == 4){
                  arr[i].flowno = "报销";
                arr[i].reimtypeid = "医疗费";
                 arr[i].userName1 = '赵六'
                temparr.push(arr[i]);
              }
            }
            //  console.log(temparr);

             
              // 把后台返回的数据放到本地存储
              sessionStorage.setItem("approvebxarr", JSON.stringify(temparr));

                that.tableData1e = temparr;
          }
        })
        .catch((error) => {
          console.log(error);
        });
    },
    // 审批报销通过接口
    passApprove() {
      this.dialogVisible = false; //关闭模态框
      let arr = this.formLabelAlign;
      let pid = JSON.parse(sessionStorage.getItem('empid'))

      let url = "/api/passReim";
      let data = {
        empid: pid,
        flownodeid: arr.currentnode,
        // username: arr.username,
        username: arr.userName1,
        addtime: arr.addtime,
        universalid: arr.reimid,
        remark: arr.remark,
      };
      this.$axios({
        method: "post",
        url: url,
        headers: { "Content-Type": "application/json;charset=utf-8" },
        data: JSON.stringify(data),
      }).then((res) => {
        console.log(res); 
      });
    },
    // 审批驳回接口
    overApprove() {
      this.dialogVisible = false; //关闭模态框
      let arr = this.formLabelAlign;
      let pid = JSON.parse(sessionStorage.getItem('empid'))

      let url = "/api/noPassReim";
      let data = {
        empid: pid,
        flownodeid: arr.currentnode,
        // username: arr.username,
        username: arr.userName1,
        addtime: arr.addtime,
        universalid: arr.reimid,
        remark: arr.remark,
      };
      this.$axios({
        method: "post",
        url: url,
        headers: { "Content-Type": "application/json;charset=utf-8" },
        data: JSON.stringify(data),
      }).then((res) => {
        console.log(res);
      });
    },
    //  待处理审批接口
       waitapprove(){
        let arr = JSON.parse(sessionStorage.getItem('approvebxarr'));
        //  console.log(this.tableData2e)
        let temparr = [];
          arr.forEach(item=>{
            item.status = '待处理';
            temparr.push(item)
          })
          console.log(temparr)
          this.tableData2e = temparr;
       } ,
    // 模态框
    pass(row) {
      let arr = JSON.parse(sessionStorage.getItem('approvebxarr'));
       let pid=JSON.parse(sessionStorage.getItem('empid'));
      arr.forEach(item=>{
        if(pid==3){
         item.userName1="赵六"
        }else if(pid==4){
          item.userName1="李德师"
      }
      })
      
      this.dialogVisible = true; //弹出模态框
      this.formLabelAlign = {
        currentnode: row.currentnode,//审批编号
        reimid:row.reimid,//事项编号
        // username: row.username,//申请人
        flowno: row.flowno,//申请事项
        addtime:row.addtime,//申请时间
        reimtypeid:row.reimtypeid,//报销类型
        reimamount:row.reimamount,//报销金额
        feedetails: row.feedetails,//事项说明
        username1:row.userName1,//审批人
        // remark:row.remark,
      };
      this.formLabelAlign.userName1=arr[0].userName1  //审批人
     

    },
    pass3(){

    },
    // 筛选查询审批的事项
    approveSearch(){
      let arr = JSON.parse(sessionStorage.getItem('approvebxarr'));//获取本地储存的后台数据
      let value = this.input3;
      let temparr = [];
      // console.log(value)
      // console.log(arr)
      arr.forEach(element => {
        // console.log(value == element.leaveid)
        if(value == element.reimid){
            temparr.push(element)
          }else if(value == element.username){
            temparr.push(element)
          }else if(value == element.addtime){
            temparr.push(element)
          }
      });
    // 使用本地储存后，数据会出现异步问题for循环无法拿到数据，可以用foreach语句
    // for(let i=0,len=arr.lenth;i<len;i++){
    //   console.log(value == arr[i].leaveid)
    //     if(value == arr[i].leaveid){
    //         temparr.push(arr[i])
    //     }
    //     console.log(temparr)
    // }

    console.log(temparr)
      this.tableData1e = temparr;

    },

    // 模态框关闭
    handleClose(done) {
      this.$confirm("确认关闭？")
        .then((_) => {
          done();
        })
        .catch((_) => {});
    },
    //一页显示多少条
    pxSizeChange(size) {
      this.pagesize = size;
    },
    // 显示当前页数
    pxCurrentChange(currentPage) {
      this.currentPage = currentPage;
    },
    // 解决分页索引不改变
    indexMethod(index) {
      // console.log(index);
      return (this.currentPage - 1) * this.pagesize + index + 1;
    },
    // 表格
    tableRowClassName({ row, rowIndex }) {
      if (rowIndex === 1) {
        return "warning-row";
      } else if (rowIndex === 3) {
        return "success-row";
      }
      return "";
    },
    handleClick() {},
  },
  // 生命周期函数:页面loading完成请求后台数据
  created() {
    // 查询需要审批的请假单接口
    this.initInfo();
    this.waitapprove();
  },
};
</script>

<style scoped lang="less">
.px-title {
  height: 50px;
  line-height: 50px;
  border: 1px solid gray;
}

.px-radius {
  padding: 10px;
  box-shadow: 0 0 1px gray;
  border-radius: 5px;
  box-shadow: 0 0 3px 1px #e4e4e4;
}
// 表格样式
.el-table .warning-row {
  background: oldlace;
}

.el-table .success-row {
  background: #f0f9eb;
}
.my-fy {
  margin-top: 20px;
  padding: 10px;
  border: 1px solid #e4e4e4;
  box-shadow: 0 0 3px 1px #e4e4e4;
  border-radius: 3px;
}
</style>